<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:crm="http://www.thymeleaf.org/crm"
	xmlns:dt="http://github.com/dandelion/datatables">

<head th:replace="fragment/common :: header"></head>
<body>

	<div th:replace="fragment/common :: topnav"></div>

	<div id="wrap">

		<div class="container-fluid">

			<div class="row">
				<div class="span8">
					<h4 th:if="${newLead}">New Contact</h4>
					<h4 th:if="${view}">View Contact Details</h4>
					<h4 th:if="${edit}">Edit Contact</h4>
				</div>
				<div class="span4 pull-right">
					<div class="btn-group pull-right">
						<a class="btn btn-primary" href="list"> <i
							class="fa fa-plus-square"></i> View Contacts
						</a>
						<button class="btn btn-warning">
							<i class="fa fa-upload"></i> Import Contacts
						</button>

					</div>
				</div>
			</div>


			<form
				th:action="${id == null} ? @{/contact/save} : @{/contact/update}"
				class="form-horizontal small labels" method="POST"
				th:object="${contact}">
				<input type="hidden" th:field="*{id}" />

				<div class="row-fluid" th:if="${edit}">
					<div class="alert alert-success" th:if="${message != null}">
						<button type="button" class="close" data-dismiss="alert">&times;</button>
						<b>Success!</b> Contact updated successfully.
					</div>
				</div>

				<div class="row-fluid" th:if="${newContact or view}">
					<div class="alert alert-success" th:if="${message != null}">
						<button type="button" class="close" data-dismiss="alert">&times;</button>
						<b>Success!</b> Contact saved successfully.
					</div>
				</div>



				<fieldset>
					<legend>
						Lead Information

						<div class="pull-right">
							<button type="submit" class="btn btn-primary" th:if="${!view}">Save</button>
							<button type="button" class="btn" th:if="${!view}">Cancel</button>



							<a class="btn btn-primary" th:href="@{/contact/edit(id=*{id})}"
								th:if="${view}">Edit</a> <a class="btn btn-danger"
								th:href="@{/contact/delete(id=*{id})}" th:if="${view}">Delete</a>
							<a class="btn btn-info" th:href="@{/contact/copy(id=*{id})}"
								th:if="${view}">Copy</a> <a class="btn" href="list"
								th:if="${view}">Back</a>

						</div>

					</legend>


					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="salutation">Salutation</label>
								<div class="controls">


									<select th:field="*{salutation}" class="span12"
										th:disabled="${view}">
										<option th:each="s : ${salutationList}" th:value="${s.id}"
											th:text="#{${s.key}}" th:selected="${contact.salutation eq s}"></option>
									</select>

								</div>
							</div>

						</div>

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="firstName">First Name</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{firstName}"
										th:disabled="${view}" />

								</div>
							</div>
						</div>

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="lastName">Last Name</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{lastName}"
										required="required" th:disabled="${view}" />

								</div>
							</div>
						</div>

					</div>

					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="company">Account</label>
								<div class="controls">
								
										<input type="text" class="span12"
										th:field="*{account.name}" th:disabled="${view}"/> 
										
										<input type="hidden" th:field="*{account.id}" />


								</div>
							</div>
						</div>

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="title">Designation</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{title}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>



						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="department">Department</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{department}" th:disabled="${view}"/>


								</div>
							</div>

						</div>

					</div>

					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group"
								th:class="${#fields.hasErrors('email') ? 'control-group error' : 'control-group'}">
								<label class="control-label" for="email">Email</label>
								<div class="controls">
									<input type="email" class="span12" th:field="*{email}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>

						<div class="span4">

							<div class="control-group"
								th:class="${#fields.hasErrors('secondaryEmail') ? 'control-group error' : 'control-group'}">
								<label class="control-label" for="secondaryEmail">Secondary
									Email</label>
								<div class="controls">
									<input type="email" class="span12" th:field="*{secondaryEmail}"
										th:disabled="${view}" />

								</div>
							</div>
						</div>



						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="title">Birth Day</label>
								<div class="controls">
									
									<input type="date" class="span12" th:field="*{birthDay}" th:disabled="${view}"/>
									
								</div>
							</div>
						</div>


					</div>


					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="phone">Phone</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{phone}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="mobile">Mobile</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{mobile}"
										required="required" th:disabled="${view}" />

								</div>
							</div>
						</div>



						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="fax">Fax</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{fax}"
										th:disabled="${view}" />

								</div>
							</div>
						</div>


					</div>

					<div class="row-fluid ">

						<div class="span12">

							<div class="control-group">
								<label class="control-label" for="description">Description</label>
								<div class="controls">

									<textarea rows="3" cols="30" th:field="*{description}"
										class="span12" th:disabled="${view}"> </textarea>
								</div>
							</div>
						</div>


					</div>



				</fieldset>


				<fieldset>
					<legend>Billing Address</legend>

					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="city">City</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{billing.city}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="state">State</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{billing.state}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>



						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="title">Country</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{billing.country}"
										th:disabled="${view}" />

								</div>
							</div>
						</div>


					</div>


					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="zip">Zip</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{billing.zip}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>

						<div class="span8">

							<div class="control-group">
								<label class="control-label" for="street">Street</label>
								<div class="controls">

									<textarea rows="3" cols="30" th:field="*{billing.street}"
										class="span12" th:disabled="${view}"> </textarea>
								</div>
							</div>
						</div>


					</div>


				</fieldset>
				
				<fieldset>
					<legend>Mailing Address</legend>

					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="city">City</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{mailing.city}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="state">State</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{mailing.state}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>



						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="title">Country</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{mailing.country}"
										th:disabled="${view}" />

								</div>
							</div>
						</div>


					</div>


					<div class="row-fluid ">

						<div class="span4">

							<div class="control-group">
								<label class="control-label" for="zip">Zip</label>
								<div class="controls">
									<input type="text" class="span12" th:field="*{mailing.zip}"
										th:disabled="${view}" />
								</div>
							</div>
						</div>

						<div class="span8">

							<div class="control-group">
								<label class="control-label" for="street">Street</label>
								<div class="controls">

									<textarea rows="3" cols="30" th:field="*{mailing.street}"
										class="span12" th:disabled="${view}"> </textarea>
								</div>
							</div>
						</div>


					</div>


				</fieldset>

				<div class="row-fluid">

					<div class="pull-right">
						<button type="submit" class="btn btn-primary" th:if="${!view}">Save</button>
							<button type="button" class="btn" th:if="${!view}">Cancel</button>



							<a class="btn btn-primary" th:href="@{/contact/edit(id=*{id})}"
								th:if="${view}">Edit</a> <a class="btn btn-danger"
								th:href="@{/contact/delete(id=*{id})}" th:if="${view}">Delete</a>
							<a class="btn btn-info" th:href="@{/contact/copy(id=*{id})}"
								th:if="${view}">Copy</a> <a class="btn" href="list"
								th:if="${view}">Back</a>
					</div>

				</div>


			</form>


		</div>


		<div id="push"></div>
	</div>

	<!-- 
	<footer th:replace="fragment/common :: footer"></footer>
	 -->

	<script type="text/javascript">
		$(document).ready(
				function() {

					$('input[required="true"]').closest(".control-group")
							.children("label").prepend(
									'<i class="icon-asterisk"></i>');

					$('input[required="required"]').closest(".control-group")
							.children("label").prepend(
									'<i class="icon-asterisk"></i>');

					$("#assignedTeam").hide();

					$("input[value='User']").click(function() {
						if ($(this).is(":checked")) {

							alert('user clicked');

							$("#assignedUser").show();
							$("#assignedTeam").hide();
						}

					});

					$("input[value='Team']").click(function() {
						alert('team clicked');
						if ($(this).is(":checked")) {
							$("#assignedTeam").show();
							$("#assignedUser").hide();
						}
					});

				});
	</script>



</body>
</html>